<template>
  <tab-bar>
    <tab-item path='/home'>
      <i slot="icon" class="fas fa-home"></i>
      <div slot="text">首页</div>
    </tab-item>
    <tab-item path='/category'>
      <i slot="icon" class="fas fa-calendar-alt"></i>
      <div slot="text">分类</div>
    </tab-item>
    <tab-item path='/cart'>
      <i slot="icon" class="fas fa-cart-plus"></i>
      <div slot="text">购物车</div>
    </tab-item>
    <tab-item path='/profile'>
      <i slot="icon" class="fas fa-user"></i>
      <div slot="text">我的</div>
    </tab-item>
  </tab-bar>
</template>
<script>
  import TabBar from "../common/tabbar/TabBar";
  import TabItem from "../common/tabbar/TabItem";

  export default {
    data() {
      return {};
    },
    components: {
      TabBar,
      TabItem
    },
  };
</script>
<style scoped>
  tab-bar{
    height: 49px;
  }
</style>